<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title><%- is_login ? t('login.title') : t('signup.title') %> - <%- t('global.title') %></title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="shortcut icon" href="/images/favicon.ico" />
    <link rel="stylesheet" href="/dashboard/css/bootstrap.min.css">
    <link rel="stylesheet" href="/dashboard/css/font-awesome.min.css">
    <link rel="stylesheet" href="/dashboard/css/AdminLTE.min.css">
    <style>
        .login-page{ color:#fff; background:url(/dashboard/images/sign-in.jpg); background-size:cover}
        .log-area{ margin-top:30px}
        p.pull-right{ margin-bottom:0}
        .nav-tabs-custom{ background:rgba(255,255,255,0.15)}
        .login-logo img{ max-height:100px}
        a{ color:#f26236}
        a:hover{ color:#FF5809}
        .btn-primary{ background-color:#f26236; border-color:#f26236}
        .btn-primary:hover,.btn-primary:active,.btn-primary:focus{ background-color:#FF5809!important; border-color:#FF5809!important}
    </style>
</head>
<body class="hold-transition login-page">
<div class="login-box">
    <div class="login-logo">
        <a href="#"><b><img src="<%= logo %>" /></b></a>
    </div>
    <div class="nav-tabs-custom">
        <div class="tab-content">
            <!--login-->
            <div class="login-box-body tab-pane<%= is_login ? " active" : "" %>" id="login">
                <% if(!success) { %>
                <p class="login-box-msg text-bold"><%= error %></p>
                <% } %>
                <form action="/login" method="post">
                    <input type="hidden" value="<%= security_code %>" name="security_code" />
                    <div class="form-group has-feedback">
                        <input type="email" class="form-control" name="email" value="<%= data.email %>" placeholder="<%- t('login.email.placeholder') %>">
                        <span class="fa fa-user form-control-feedback"></span>
                    </div>
                    <div class="form-group has-feedback">
                        <input type="password" class="form-control" name="password" placeholder="<%- t('login.password.placeholder') %>">
                        <span class="fa fa-lock form-control-feedback"></span>
                    </div>
                    <p ><span class = "pull-left" style="display: none"><a href="/login/forgot"><%- t('login.forgot')%></a></span><span class="pull-right"><%- t('login.noaccount') %><a href="#singup" data-toggle="tab"><%- t('login.signupnow') %></a></span></p>
                    <div class="clearfix"></div>
                    <div class="row log-area">
                        <div class="col-xs-12">
                            <button type="submit" class="btn btn-primary btn-block btn-flat"><%- t('login.submit.text') %></button>
                        </div>
                    </div>
                </form>
            </div>
            <!--signup-->
            <div class="login-box-body tab-pane<%= !is_login ? " active" : "" %>" id="singup">
                <p class="login-box-msg text-bold" id="singup_err">
                    <% if(!success) { %>
                        <%= error %>
                    <% } %>
                </p>
                <form action="/signup" method="post" id="singup_form">
                    <input type="hidden" value="<%= security_code %>" name="security_code" />
                    <div class="form-group has-feedback">
                        <input type="text" class="form-control" name="name" value="<%= data.name %>" placeholder="<%- t('global.username') %>" id="name">
                        <span class="fa fa-user form-control-feedback"></span>
                    </div>
                    <div class="form-group has-feedback">
                        <input type="email" class="form-control" name="email" value="<%= data.email %>" placeholder="<%- t('login.email.placeholder') %>" id="email">
                        <span class="fa fa-envelope form-control-feedback"></span>
                    </div>
                    <div class="form-group has-feedback">
                        <input type="password" class="form-control" name="password" placeholder="<%- t('login.password.placeholder') %>" id="password">
                        <span class="fa fa-lock form-control-feedback"></span>
                    </div>
                    <div class="clearfix"></div>
                    <div class="row log-area">
                        <div class="col-xs-12">
                            <div class="btn btn-primary btn-block btn-flat" id="submit"><%- t('signup.submit.text') %></div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script src="/dashboard/js/jQuery-2.1.4.min.js"></script>
<script src="/dashboard/js/bootstrap.min.js"></script>
<script>
    $(function(){
        $('#submit').click(function(){

            function check(){
                var errorMsg=null;

                if( !$.trim($('#name').val()) ){
                    return errorMsg = {msg: "<%- t('login.errors.username_empty') %>",target:'name'}
                }

                if( !$.trim($('#email').val()) ){
                    return errorMsg = {msg: "<%- t('login.errors.email_empty') %>",target:'email'}
                }else if( $.trim($('#email').val())!="" && !/.+@.+\.[a-zA-Z]{2,4}$/.test($('#email').val()) ){
                    return errorMsg = {msg: "<%- t('login.errors.invalid_email_address') %>", target:'email'}
                }

                if( !$.trim($('#password').val()) ){
                    return errorMsg = {msg: "<%- t('login.errors.password_empty') %>",target:'password'}
                }else if( $.trim($('#password').val()).length < 6 ){
                    return errorMsg = {msg: "<%- t('login.errors.invalid_password_len') %>",target:'password'}
                }

                return errorMsg
            }

            var err=check();

            if(err){
                $('#singup_err').html(err.msg);
                $('#'+err.target).focus()
            }else{
                $('#singup_form').submit()
            }

        })
    })
</script>
<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
    ga('create', 'UA-46105991-4', 'auto');
    ga('send', 'pageview')
</script>
</body>
</html>
